<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0">
    <title>简陋的配对小工具</title>
    <script type="text/javascript">
    // https://stackoverflow.com/a/2450976/9035237
    // Or use random.org? 
    function shuffle(array) {
        var currentIndex = array.length, temporaryValue, randomIndex;
        // While there remain elements to shuffle...
        while (0 !== currentIndex) {
            // Pick a remaining element...
            randomIndex = Math.floor(Math.random() * currentIndex);
            currentIndex -= 1;
            // And swap it with the current element.
            temporaryValue = array[currentIndex];
            array[currentIndex] = array[randomIndex];
            array[randomIndex] = temporaryValue;
        }
        return array;
    }

    function roll()
    {
        let people = document.getElementById("people").value;
        let array = Array();
        for (i = 0; i < people; i++) array.push(i + 1);
        shuffle(array);
        let result = "<br/>";
        for (i = 0; i < people / 2; i++) result += "第 " + (i + 1) + " 组：" + array[2 * i] + " 和 " + array[2 * i + 1] + "<br/>";
        document.getElementById("result").innerHTML = result;
    }
    </script>
</head>
<body>
    有<input type="number" id="people" />人。<button onclick="roll()">配对！</button><br />
    配对结果：<span id="result"></span><br/>
</body>
